<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>toXlsxInWeb（辉）</title>
		<style>
			body { font-family: Arial, sans-serif; padding: 20px; }
			.container { max-width: 800px; margin: 0 auto; }
			div { margin-top: 20px; max-height: 300px; overflow-y: auto; border: 1px solid #ddd; padding: 10px; }
			button { padding: 8px 20px; background: #4CAF50; color: white; border: none; cursor: pointer; }
			button:hover { background: #45a049; }
		</style>
		<script src="./js/xlsx.full.min.js"></script>
	</head>
	<body>
		<!-- 在HTML的body中添加以下输入框 -->
		<div style="margin: 10px 0;">
		    <label>分列分隔符：</label>
		    <input type="text" id="delimiterInput" style="width: 100px;">
		    
		    <label style="margin-left: 20px;">文件编码：</label>
		    <input type="text" id="encodingInput" style="width: 100px;" 
		           placeholder="如：GBK, UTF-8">
		</div>
		<div>
			<input type="file" id="fileInput" accept=".txt,.csv">
			<button id="btn2" onclick="processFile()">开始处理</button>
		</div>
		<div id="preview"></div>
	</body>
	<script>
		// 定义全局变量存储配置，自定根据需求更改
		let delimiter = '"|"';
		let encoding = 'GBK';
	
	
		// 页面加载完成后初始化，将全局变量默认值放入输入框，并鉴定输入框变更
		window.onload = function() {
		    // 初始化输入框
		    const delimiterInput = document.getElementById('delimiterInput');
		    const encodingInput = document.getElementById('encodingInput');
		    			
		    // 设置默认值
		    delimiterInput.value = delimiter;
		    encodingInput.value = encoding;
		 
		    // 绑定输入事件监听
		    delimiterInput.addEventListener('input', function(e) {
		        delimiter = e.target.value;
		        console.log('分隔符已更新:', delimiter);
		    });
		 
		    encodingInput.addEventListener('input', function(e) {
		        encoding = e.target.value;
		        console.log('编码已更新:', encoding);
		    });
		}
	
	
		//处理数据文件函数
		function processFile() {
		
			//获取html元素
			const fileInput = document.getElementById('fileInput');
			const previewDiv = document.getElementById('preview');
			previewDiv.innerHTML = '处理中...';
			
			//未选择文件提示
			if (!fileInput.files || fileInput.files.length === 0) {
				previewDiv.innerHTML = '请选择文件';
				return;
			}
			
			//获取文件属性，初始化参数，流式处理（每次处理1MB）
			const file = fileInput.files[0];
			const chunkSize = 1024 * 1024; // 1MB分块
			let currentChunk = 0;
			let buffer = '';
			const dataRows = [];		//暂存数据
			
			// 获取原始文件名
			const originalFilename = file.name.replace(/\.[^/.]+$/, ""); // 移除扩展名
			
			
			// 读取文件内容
			function processChunk() {
				const reader = new FileReader();
				const start = currentChunk * chunkSize;
				const end = Math.min(file.size, start + chunkSize);
				const slice = file.slice(start, end);
		 
				reader.onload = function(e) {
					buffer += e.target.result;
					currentChunk++;
		 
					// 分割缓冲区中的完整行
					let lines = buffer.split(/\r\n|\n|\r/);
					let lastLine = lines.pop(); // 保存可能不完整的最后一行
		 
					// 处理完整行
					lines.forEach(line => {
						const cols = line.split(delimiter).map(col => col.trim()).filter(col => col !== '');
						if (cols.length > 0) dataRows.push(cols);
					});
		 
					buffer = lastLine; // 将不完整的行保留到下次处理
		 
					if (currentChunk * chunkSize < file.size) {
						// 继续读取下一块
						processChunk();
					} else {
						// 处理剩余内容
						if (buffer.length > 0) {
							const cols = buffer.split('|').map(col => col.trim()).filter(col => col !== '');
							if (cols.length > 0) dataRows.push(cols);
						}
						
						//全部处理完成后，生成文件
						generateExcel(dataRows, originalFilename);
					}
				};
		 
				reader.onerror = function() {
					previewDiv.innerHTML = '文件读取失败';
				};
		 
				// 读取文件块（编码）
				reader.readAsText(slice, encoding);
			}
			// 开始处理第一个分块
			processChunk();
		}
		
		//生成表格文件
		function generateExcel(data, originalFilename) {
			const previewDiv = document.getElementById('preview');
			if (data.length === 0) {
				previewDiv.innerHTML = '文件内容为空，无法生成Excel';
				return;
			}
			try {
				const ws = XLSX.utils.aoa_to_sheet(data);
				const wb = XLSX.utils.book_new();
				XLSX.utils.book_append_sheet(wb, ws, "Sheet1");
				XLSX.writeFile(wb, originalFilename+".xlsx");
				previewDiv.innerHTML = '表格生成成功！';
			} catch (error) {
				previewDiv.innerHTML = `生成Excel失败: ${error.message}`;
			}
		}
		
	</script>
	
</html>
